<!-- 系统管理-消息管理 -->
<template>
    <a-row :gutter="24">
        <a-col :md="24">
            <a-card :style="cardStyle" :bordered="false">
                <!-- 查询区域 -->
                <div class="table-page-search-wrapper">
                    <!-- 搜索区域 -->
                    <a-form layout="inline" @keyup.enter.native="searchQuery">
                        <a-row :gutter="24">
                            <a-col :md="6" :sm="24">
                                <a-form-item label="标题" :labelCol="labelCol" :wrapperCol="wrapperCol">
                                    <a-input placeholder="请输入标题" v-model="queryParam.name"></a-input>
                                </a-form-item>
                            </a-col>
                            <!-- <a-col :md="6" :sm="24">
                                <a-form-item label="类型" :labelCol="labelCol" :wrapperCol="wrapperCol">
                                    <a-select v-model="queryParam.type" placeholder="请选择类型">
                                        <a-select-option value="">请选择</a-select-option>
                                        <a-select-option value="业务员">业务员</a-select-option>
                                        <a-select-option value="财务员">财务员</a-select-option>
                                    </a-select>
                                </a-form-item>
                            </a-col> -->
                            <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
                                <a-col :md="6" :sm="24">
                                    <a-button type="primary" @click="searchQuery">查询</a-button>
                                    <a-button style="margin-left: 8px" @click="searchReset">重置</a-button>
                                </a-col>
                            </span>
                        </a-row>
                    </a-form>
                </div>
                <!-- 操作按钮区域 -->
                <div class="table-operator" style="margin-top: 5px">
                    <a-button v-if="btnEnableList.indexOf(1)>-1" @click="handleAdd" type="primary"
                        icon="plus">新增</a-button>
                    <a-dropdown>
                        <a-menu slot="overlay">
                            <a-menu-item key="1" v-if="btnEnableList.indexOf(1)>-1" @click="batchDel"><a-icon
                                    type="delete" />删除</a-menu-item>
                            <!-- <a-menu-item key="2" v-if="btnEnableList.indexOf(1)>-1"
                                @click="batchSetStatus(true)"><a-icon type="check-square" />启用</a-menu-item>
                            <a-menu-item key="3" v-if="btnEnableList.indexOf(1)>-1"
                                @click="batchSetStatus(false)"><a-icon type="close-square" />禁用</a-menu-item> -->
                        </a-menu>
                        <a-button>
                            批量操作 <a-icon type="down" />
                        </a-button>
                    </a-dropdown>
                </div>
                <!-- table区域-begin -->
                <div>
                    <a-table ref="table" size="middle" bordered rowKey="id" :columns="columns" :dataSource="dataSource"
                        :pagination="ipagination" :scroll="scroll" :loading="loading"
                        :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
                        @change="handleTableChange">
                        <span slot="action" slot-scope="text, record">
                            <!-- <a @click="handleEdit(record)">编辑</a> -->
                            <a-divider v-if="btnEnableList.indexOf(1)>-1" type="vertical" />
                            <a-popconfirm v-if="btnEnableList.indexOf(1)>-1" title="确定删除吗?"
                                @confirm="() => handleDelete(record.id)">
                                <a>删除</a>
                            </a-popconfirm>
                        </span>
                        <!-- 状态渲染模板 -->
                        <template slot="customRenderFlag" slot-scope="enabled">
                            <a-tag v-if="enabled" color="green">启用</a-tag>
                            <a-tag v-if="!enabled" color="orange">禁用</a-tag>
                        </template>
                    </a-table>
                </div>
                <!-- table区域-end -->
                <!-- 表单区域 -->
                <message-modal ref="modalForm" @ok="modalFormOk"></message-modal>
            </a-card>
        </a-col>
    </a-row>
</template>
<!-- f r o m 7 5  2 7 1  8 9 2 0 -->
<script>
import MessageModal from './modules/MessageModal'
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
import JDate from '@/components/jeecg/JDate'
import Vue from 'vue'
export default {
    name: 'PersonList',
    mixins: [JeecgListMixin],
    components: {
        MessageModal,
        JDate,
    },
    data() {
        return {
            labelCol: {
                span: 5,
            },
            wrapperCol: {
                span: 18,
                offset: 1,
            },
            // 查询条件
            queryParam: {
                name: undefined,
                // type: '',
                roleType: Vue.ls.get('roleType'),
            },
            // 表头
            columns: [
                {
                    title: '#',
                    dataIndex: '',
                    key: 'rowIndex',
                    width: 40,
                    align: 'center',
                    customRender: function (t, r, index) {
                        return parseInt(index) + 1
                    },
                },
                // {
                //     title: '操作',
                //     dataIndex: 'action',
                //     align: 'center',
                //     width: 100,
                //     scopedSlots: { customRender: 'action' },
                // },
                {
                    title: '标题',
                    dataIndex: 'msgTitle',
                    scopedSlots: { customRender: 'customRenderTitle' },
                    width: 200,
                },
                {
                    title: '消息类型',
                    dataIndex: 'type',
                    width: 80,
                },
                {
                    title: '通知日期',
                    dataIndex: 'createTimeStr',
                    width: 90,
                },
            ],
            url: {
                list: '/msg/list',
                delete: '/person/delete',
                deleteBatch: '/msg/deleteBatch',
                batchSetStatusUrl: '/person/batchSetStatus',
            },
        }
    },
    computed: {},
    methods: {
        handleEdit: function (record) {
            this.$refs.modalForm.edit(record)
            this.$refs.modalForm.title = '编辑'
            this.$refs.modalForm.disableSubmit = false
            if (this.btnEnableList.indexOf(1) === -1) {
                this.$refs.modalForm.isReadOnly = true
            }
        },
    },
}
</script>
<style scoped>
@import '~@assets/less/common.less';
</style>